<template>
	<view class="wrap">
		<view class="logo">
			<image src="https://ya30images.hbwlife.com/wxmp/logo-yongan30.png" mode=""></image>
		</view>
		<view class="btn-wrap">
			<button class="add-btn" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
				绑定手机号
			</button>
		</view>
		<view class="tips">
			<view class="tip-content" @click="handleToggle">
				<view class="toggle-check" :class="[active ? 'toggle-active' : '']">
					<u-icon v-show="active" name="checkbox-mark" color="#fff"></u-icon>
				</view>
				<view class="tip-data">
					已阅读并同意以下协议:<text class="txt" @click="goUserAgreement">《用户协议》</text>和<text class="txt"
						@click="goPrivacyPolicy">《隐私协议》</text>
				</view>
			</view>
		</view>
		<view class="not-login" @click="goHome">暂不绑定</view>
	</view>
</template>

<script>
	import {
		request,
		requestData
	} from '../../utils/http.js'
	export default {
		data() {
			return {
				active: false,
				currentPath: '',
			}
		},
		onLoad(options) {
			if (options.currentPath) {
				this.currentPath = decodeURIComponent(options.currentPath)
			}
		},
		onShow() {
			let open_id = uni.getStorageSync('open_id')
			console.log(open_id)
			if (!open_id) {
				this.fnlogin()
			}
		},
		methods: {
			fnlogin() {
				let user_id = uni.getStorageSync('user_id')
				if (!user_id) {
					uni.login({
						success: (res) => {
							uni.request({
								url: 'https://ya30api.hbwlife.com/wxmp/wxaccess/mp/user/login',
								method: 'POST',
								header: {},
								data: {
									wxlogin_code: res.code,
								},
								success: (ress) => {
									if (ress.data.code == 0) {
										uni.removeStorageSync('access_token')
										uni.removeStorageSync('mobile')
										uni.removeStorageSync('avatarUrl')
										uni.setStorageSync(
											'open_id',
											ress?.data?.datas?.open_id || ''
										)
										uni.setStorageSync(
											'user_id',
											ress?.data?.datas?.user_id || ''
										)
										uni.setStorageSync('mobile', ress?.data?.datas.mobile ||
											'')
										uni.setStorageSync(
											'avatarUrl',
											ress?.data?.datas.avatarUrl || ''
										)
										uni.setStorageSync(
											'access_token',
											ress?.data?.datas?.access_token || ''
										)
									} else {
										uni.showToast({
											title: ress.msg,
											icon: 'none',
										})
									}
								},
								complete: () => {},
								fail: (err) => {
									reject(err)
								},
							})
						},
					})
				}
			},
			fnLoginPhone(code) {
				let open_id = uni.getStorageSync('open_id')
				let access_token = uni.getStorageSync('access_token')
				request('/wxaccess/mp/user/getPhoneNumber', {
						wxphone_code: code,
						open_id: open_id,
					})
					.then((res) => {
						//if (res.code == 0) {
						uni.setStorageSync('open_id', res?.datas?.open_id || '')
						uni.setStorageSync('user_id', res?.datas?.user_id || '')
						uni.setStorageSync('access_token', res?.datas?.access_token || '')
						uni.setStorageSync('mobile', res?.datas.mobile || 0)
						uni.showToast({
							title: '绑定成功！',
							icon: 'success',
						})
						if (this.currentPath) {
							uni.redirectTo({
								url: this.currentPath,
							})
						} else {
							setTimeout(() => {
								uni.navigateBack()
							}, 2000)
						}

						// } else {
						//   uni.showToast({
						//     title: res.msg,
						//     icon: 'none',
						//   })
						// }
					})
					.catch((err) => {
						uni.showToast({
							title: err,
							duration: 2000,
							icon: 'none',
						})
					})

			},
			//手机号
			onGetPhoneNumber(e) {
				if (!this.active) {
					uni.$u.toast('请先阅读并同意隐私政策')
					return
				}
				const {
					detail: {
						encryptedData,
						iv,
						code
					},
				} = e
				if (e.detail.errMsg === 'getPhoneNumber:ok') {
					let open_id = uni.getStorageSync('open_id')
					let access_token = uni.getStorageSync('access_token')
					request('/wxaccess/mp/user/getPhoneNumber', {
							wxphone_code: code,
							open_id: open_id,
						})
						.then((res) => {
							//if (res.code == 0) {
							uni.setStorageSync('open_id', res?.datas?.open_id || '')
							uni.setStorageSync('user_id', res?.datas?.user_id || '')
							uni.setStorageSync('access_token', res?.datas?.access_token || '')
							uni.setStorageSync('mobile', res?.datas.mobile || 0)
							uni.showToast({
								title: '绑定成功',
								icon: 'success',
							})
							uni.switchTab({
								url: '/pages/home/index',
							})
							// if (this.currentPath && this.currentPath !== undefined) {
							// 	console.log(this.currentPath)
							// 	uni.redirectTo({
							// 		url: this.currentPath,
							// 	})
							// } else {
							// 	consol.log(2)
							// 	setTimeout(() => {
							// 		uni.navigateBack()
							// 	}, 2000)
							// }

							// } else {
							//   uni.showToast({
							//     title: res.msg,
							//     icon: 'none',
							//   })
							// }
						})
						.catch((err) => {
							uni.showToast({
								title: err,
								duration: 2000,
								icon: 'none',
							})
						})
				} else {
					uni.showToast({
						title: '为了给您提供更好的服务，请同意获取手机号！',
						duration: 2000,
						icon: 'none',
					})
				}
			},

			handleToggle() {
				this.active = !this.active
			},
			goPrivacyPolicy(event) {
				event.stopPropagation()
				uni.navigateTo({
					url: '/pages/privacyPolicy/index',
				})
			},
			goUserAgreement(event) {
				event.stopPropagation()
				uni.navigateTo({
					url: '/pages/userAgreement/index',
				})
			},
			goHome() {
				uni.switchTab({
					url: '/pages/home/index'
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	.wrap {
		width: 100%;
		height: 100vh;
		box-sizing: border-box;
		background: #fff;
		font-size: 32rpx;
		display: flex;
		flex-flow: column;
		align-items: center;
	}

	.logo {
		width: 360rpx;
		height: 360rpx;
		margin-top: 20%;

		image {
			display: flex;
			justify-content: center;
			align-items: center;
			width: 100%;
			height: 100%;
		}
	}

	.btn-wrap {
		padding: 80rpx;
		width: 91%
	}

	.add-btn {
		border: none;
		height: 80rpx;
		line-height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 16rpx;
		color: #533504;
		background: linear-gradient(to right, #c8a357, #fbde94, #c8a357);
		font-size: 32rpx;

	}

	button::after {
		border: none;
	}

	.tips {
		width: 90%;
		font-family: 28rpx;
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;

		.txt {
			color: $global-color-golden;
		}
	}

	.tip-content {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
	}

	.toggle-check {
		width: 28rpx;
		height: 28rpx;
		border-radius: 50%;
		border: 1px solid #d6d6d6;
		margin-right: 10rpx;
		margin-top: 10rpx;
	}

	.toggle-active {
		background-color: $global-color-golden;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		color: #fff;
		border: 1px solid $global-color-golden;
	}

	.tip-data {
		flex: 1;
	}

	.not-login {
		margin: 0 auto;
		margin-top: 30%;
		background: #f3f3f3;
		font-size: 28rpx;
		width: auto;
		height: auto;
		padding: 15rpx 30rpx;
		border-radius: 10rpx;
	}
</style>